//加载公共样式
require('../../assets/css/index.less')


let dom = require('../../utils/dom')
const request = require('../../utils/request')

//字体图标
require('../../assets/fonts/iconfont.css')
//加载自己的样式
require('./mybadge.less')

window.onload = () => {
    const back = document.querySelector('#back')
    const badgesList=document.querySelector('#badgesList')
    const rankingNum=document.querySelector('.rankingNum')

    back.addEventListener('click', function () {
        history.go(-1)
    })

    //获取徽章
    function getBadge() {
        request.get("http://fitness.h5.itsource.cn:3701/api/exercise/badge").then(res => {
            console.log(res);
            let { errno, data } = res.data;
            if (errno == 0) {
                for (let i = 0; i < data.length / 3; i++)
                    data.forEach(function (v, i) {
                        let img = (require(`../../assets/imgs/mybadge0${v.id}.jpg`));
                        badgeBox.innerHTML += `<div><img src=${img} alt=""></div>`;

                    })
            }
        })
    }
    // getBadge();
    //模拟徽章图像
    let badgeArr = [
        require('../../assets/imgs/mybadge01.jpg'),
        require('../../assets/imgs/mybadge02.jpg'),
        require('../../assets/imgs/mybadge03.jpg'),
        require('../../assets/imgs/mybadge04.jpg'),
        require('../../assets/imgs/mybadge05.jpg'),
        require('../../assets/imgs/mybadge06.jpg'),
        require('../../assets/imgs/mybadge07.jpg'),
        require('../../assets/imgs/mybadge08.jpg'),
        require('../../assets/imgs/mybadge09.jpg')
    ]


    //获取运动徽章
    function getBadge() {
        request.get('http://fitness.h5.itsource.cn:3701/api/exercise/badge').then(res => {
            console.log('徽章',res);
            let { errno, data } = res.data;
            if (errno == 0) {
                // console.log(data);

                data.map(v => {
                    // console.log(v);
                    badgesList.innerHTML += `
                    <li>
                    <img src="${badgeArr[v.id - 1]}" alt="">
                    <span>${v.name}</span>
                  </li>
                    `
                })
                badgesList.innerHTML += `
                <li>
                <img src="${badgeArr[badgeArr.length - 1]}" alt="">
              </li>
                `

            }
        })
    }

    getBadge()
    // ranking合并
    function getRanking() {
        request.get('http://fitness.h5.itsource.cn:3701/api/user/info').then(res => {
            let { errno, data } = res;
            if (errno == 0) {
                console.log(data);
                rankingNum.innerHTML = data.ranking;
            }
        })
    }
    getRanking()
}